<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>兄弟，群组选择器</title>
		<style>
			/*兄弟选择器：两种结构 通用兄弟选择器[针对平行元素]
			                特点：找到当前元素名字一致的其他元素
			                语法：平行元素选择器~平行元素选择器
			                     相邻兄弟选择器【针对平行元素】
								 特点：找到当前元素名字相邻的其他元素
								 语法：平行元素选择器+平行元素选择器
								 功能：选择平行元素
			*/
		  /* h2~span{
			   background-color: #ee5527;
		   } */
		   h1+span{
			   background-color: #ee5527;
		   }
		   /*群组选择器：选择所有选中的选择器
		   语法：任意选择器，任意选择器
		   */
		  #s1,h2,h1,.s3{
			  background-color: #00ff7f;
		  }
		</style>
	</head>
	<body>
		<h2>通用兄弟选择器</h2>
		<span>lorem1</span>
		<span>lorem2</span>
		<span>lorem3</span>
		<h2>相邻兄弟选择器</h2>
		<span>lorem1</span>
		<span>lorem2</span>
		<span>lorem3</span>
	</body>
</html>